<template>
    <Layout style="height: 100%" class="main">
        <Sider hide-trigger collapsible :width="256" :collapsed-width="64" v-model="collapsed" style="overflow-y: scroll">
            <side-menu accordion :active-name="$route.name" :collapsed="collapsed" @on-select="turnToPage"
                       :menu-list="menuList">
                <!-- 需要放在菜单上面的内容，如Logo，写在side-menu标签内部，如下 -->
                <div class="logo-con">
                    <img v-show="!collapsed" :src="maxLogo1" key="max-logo"/>
                    <img v-show="collapsed" :src="minLogo1" key="min-logo"/>
                </div>
            </side-menu>
        </Sider>
        <Layout>
            <Header class="header-con">
                <header-bar :collapsed="collapsed" @on-coll-change="handleCollapsedChange">
                    <user :user-avator="userAvator"/>
                    <!--<language @on-lang-change="setLocal" style="margin-right: 10px;" :lang="local"/>-->
                    <fullscreen v-model="isFullscreen" style="margin-right: 10px;"/>
                </header-bar>
            </Header>
            <Content>
                <Layout>
                    <!--<div class="tag-nav-wrapper">
                        <tags-nav :value="$route" @input="handleClick" :parking="tagNavList" @on-close="handleCloseTag"/>
                    </div>-->
                    <Content class="content-wrapper">
                        <keep-alive :include="cacheList">
                            <router-view/>
                        </keep-alive>
                    </Content>
                </Layout>
            </Content>
        </Layout>
    </Layout>
</template>
<script>
    import SideMenu from './components/side-menu'
    import HeaderBar from './components/header-bar'
    import TagsNav from './components/tags-nav'
    import User from './components/user'
    import Fullscreen from './components/fullscreen'
    import Language from './components/language'
    import {mapMutations, mapActions} from 'vuex'
    import {getNewTagList, getNextName} from '@/libs/util'
    import minLogo from '@/assets/images/logo-min.png'
    import maxLogo from '@/assets/images/logo.png'
    import './main.less'
    import baseURL from '_conf/url'

    export default {
        name: 'Main',
        components: {
            SideMenu,
            HeaderBar,
            Language,
            TagsNav,
            Fullscreen,
            User

        },
        data() {
            return {
                collapsed: false,
                minLogo1:minLogo,
                maxLogo1:maxLogo,
                isFullscreen: false
            }
        },
        created() {
            console.log(location.hostname);
            let params={};
            params.propertyNo=location.hostname;
            this.postRequest("/api/dept/getPropertyInfo", params).then(res => {
                console.log(res);
                if(res.code==20000 && res.data != null){
                    this.maxLogo1=res.data.logoPic
                    this.minLogo1=res.data.logoMinPic
                }
            });
        },
        computed: {
            tagNavList() {
                return this.$store.state.app.tagNavList
            },
            tagRouter() {
                return this.$store.state.app.tagRouter
            },
            userAvator() {
                return this.$store.state.user.avatorImgPath
            },
            cacheList() {
                return this.tagNavList.length ? this.tagNavList.filter(item => !(item.meta && item.meta.notCache)).map(item => item.name) : []
            },
            menuList() {
                return this.$store.getters.menuList
            },
            local() {
                return this.$store.state.app.local
            }
        },
        methods: {
            ...mapMutations([
                'setBreadCrumb',
                'setTagNavList',
                'addTag',
                'setLocal'
            ]),
            ...mapActions([
                'handleLogin'
            ]),
            turnToPage(name) {
                if (name.indexOf('isTurnByHref_') > -1) {
                    window.open(name.split('_')[1])
                    return
                }
                this.$router.push({
                    name: name
                })
            },
            handleCollapsedChange(state) {
                this.collapsed = state
            },
            handleCloseTag(res, type, name) {
                const nextName = getNextName(this.tagNavList, name)
                this.setTagNavList(res)
                if (type === 'all') this.turnToPage('home')
                else if (this.$route.name === name) this.$router.push({name: nextName})
            },
            handleClick(item) {
                this.turnToPage(item.name)
            }
        },
        watch: {
            '$route'(newRoute) {
                this.setBreadCrumb(newRoute.matched)
                this.setTagNavList(getNewTagList(this.tagNavList, newRoute))
            }
        },
        mounted() {
            /**
             * @description 初始化设置面包屑导航和标签导航
             */
            this.setTagNavList()
            this.addTag(this.$store.state.app.homeRoute)
            this.setBreadCrumb(this.$route.matched)
            // 设置初始语言
            // this.setLocal(this.$i18n.locale)
            // 文档提示
            /*this.$Notice.info({
                title: '想快速上手，去看文档吧',
                duration: 0,
                render: (h) => {
                    return h('p', {
                        style: {
                            fontSize: '13px'
                        }
                    }, [
                        '点击',
                        h('a', {
                            attrs: {
                                href: 'https://lison16.github.io/iview-admin-doc/#/',
                                target: '_blank'
                            }
                        }, 'iview-admin2.0文档'),
                        '快速查看'
                    ])
                }
            })*/
        }
    }
</script>
